<!DOCTYPE html><html class=split lang=en-US-x-hixie><script src=../link-fixup.js defer=""></script>
<!-- Mirrored from html.spec.whatwg.org/multipage/embedded-content-other.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 10 Sep 2025 08:35:38 GMT -->
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=utf-8" /><!-- /Added by HTTrack -->
<meta charset=utf-8><meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name=viewport><title>HTML Standard</title><meta content=#3c790a name=theme-color><meta content="light dark" name=color-scheme><link rel=stylesheet href=../../resources.whatwg.org/standard-shared-with-dev.css crossorigin=""><link rel=stylesheet href=../../resources.whatwg.org/standard.css crossorigin=""><link rel=stylesheet href=../../resources.whatwg.org/spec.css crossorigin=""><link rel=icon href=https://resources.whatwg.org/logo.svg crossorigin=""><link rel=stylesheet href=../styles.css crossorigin=""><script>
   function toggleStatus(div) {
     div.parentNode.classList.toggle('wrapped');
   }
   function setLinkFragment(link) {
     link.hash = location.hash;
   }
  </script><body>
  
  <script defer="" crossorigin="" src=../html-dfn.js></script>
  
  <header id=head class="head with-buttons">
   <a href=https://whatwg.org/ class=logo><img width=100 alt=WHATWG crossorigin="" class=darkmode-aware src=https://resources.whatwg.org/logo.svg height=100></a>
   <hgroup><h1 class=allcaps>HTML</h1><p id=living-standard>Living Standard — Last Updated <span class=pubdate>10 September 2025</span></hgroup>
   
   

   
  </header>

  

  

  

  
  

  
  

  

  <nav><a href=image-maps.html>← 4.8.12 The map element</a> — <a href=index.html>Table of Contents</a> — <a href=tables.html>4.9 Tabular data →</a></nav><ol class=toc><li id=toc-semantics><ol><li><ol><li><a href=embedded-content-other.html#mathml><span class=secno>4.8.15</span> MathML</a><li><a href=embedded-content-other.html#svg-0><span class=secno>4.8.16</span> SVG</a><li><a href=embedded-content-other.html#dimension-attributes><span class=secno>4.8.17</span> Dimension attributes</a></ol></ol></ol><h4 id=mathml><span class=secno>4.8.15</span> MathML<a href=#mathml class=self-link></a></h4><div class="mdn-anno wrapped"><button onclick=toggleStatus(this) class=mdn-anno-btn><b title="Support in all current engines." class=all-engines-flag>✔</b><span>MDN</span></button><div class=feature><p><a href=https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/HTML5_Parser#Inline_SVG_and_MathML_support title="To build websites, you should know about HTML — the fundamental technology used to define the structure of a webpage. HTML is used to specify whether your web content should be recognized as a paragraph, list, heading, link, image, multimedia player, form, or one of many other available elements or even a new element that you define.">HTML/HTML5/HTML5_Parser#Inline_SVG_and_MathML_support</a><p class=all-engines-text>Support in all current engines.<div class=support><span class="firefox yes"><span>Firefox</span><span>4+</span></span><span class="safari yes"><span>Safari</span><span>5.1+</span></span><span class="chrome yes"><span>Chrome</span><span>7+</span></span><hr><span class="opera yes"><span>Opera</span><span>11.6+</span></span><span class="edge_blink yes"><span>Edge</span><span>79+</span></span><hr><span class="edge yes"><span>Edge (Legacy)</span><span>12+</span></span><span class="ie yes"><span>Internet Explorer</span><span>9+</span></span><hr><span class="firefox_android yes"><span>Firefox Android</span><span>5+</span></span><span class="safari_ios yes"><span>Safari iOS</span><span>5+</span></span><span class="chrome_android yes"><span>Chrome Android</span><span>18+</span></span><span class="webview_android yes"><span>WebView Android</span><span>3+</span></span><span class="samsunginternet_android yes"><span>Samsung Internet</span><span>1.0+</span></span><span class="opera_android yes"><span>Opera Android</span><span>12+</span></span></div></div></div>

  <p>The <a id=mathml:mathml-math href=https://w3c.github.io/mathml-core/#the-top-level-math-element data-x-internal=mathml-math>MathML <code>math</code></a> element falls into the <a id=mathml:embedded-content-category href=dom.html#embedded-content-category>embedded content</a>,
  <a id=mathml:phrasing-content-2 href=dom.html#phrasing-content-2>phrasing content</a>, <a id=mathml:flow-content-2 href=dom.html#flow-content-2>flow content</a>, and <a id=mathml:palpable-content-2 href=dom.html#palpable-content-2>palpable content</a>
  categories for the purposes of the content models in this specification.</p>

  <p>When the <a id=mathml:mathml-annotation-xml href=https://w3c.github.io/mathml-core/#dfn-annotation-xml data-x-internal=mathml-annotation-xml>MathML <code>annotation-xml</code></a> element contains elements from the
  <a id=mathml:html-namespace-2 href=https://infra.spec.whatwg.org/#html-namespace data-x-internal=html-namespace-2>HTML namespace</a>, such elements must all be <a id=mathml:flow-content-2-2 href=dom.html#flow-content-2>flow content</a>.</p>

  <p>When the MathML token elements (<code id=mathml:mathml-mi><a data-x-internal=mathml-mi href=https://w3c.github.io/mathml-core/#the-mi-element>mi</a></code>, <code id=mathml:mathml-mo><a data-x-internal=mathml-mo href=https://w3c.github.io/mathml-core/#operator-fence-separator-or-accent-mo>mo</a></code>, <code id=mathml:mathml-mn><a data-x-internal=mathml-mn href=https://w3c.github.io/mathml-core/#number-mn>mn</a></code>, <code id=mathml:mathml-ms><a data-x-internal=mathml-ms href=https://w3c.github.io/mathml-core/#string-literal-ms>ms</a></code>, and <code id=mathml:mathml-mtext><a data-x-internal=mathml-mtext href=https://w3c.github.io/mathml-core/#text-mtext>mtext</a></code>) are descendants of HTML elements, they may contain
  <a id=mathml:phrasing-content-2-2 href=dom.html#phrasing-content-2>phrasing content</a> elements from the <a id=mathml:html-namespace-2-2 href=https://infra.spec.whatwg.org/#html-namespace data-x-internal=html-namespace-2>HTML namespace</a>.</p>
  

  

  

  <p>User agents must handle text other than <a id=mathml:inter-element-whitespace href=dom.html#inter-element-whitespace>inter-element whitespace</a> found in MathML
  elements whose content models do not allow straight text by pretending for the purposes of MathML
  content models, layout, and rendering that the text is actually wrapped in a <a id=mathml:mathml-mtext-2 href=https://w3c.github.io/mathml-core/#text-mtext data-x-internal=mathml-mtext>MathML
  <code>mtext</code></a> element. (Such text is not, however, conforming.)</p>

  <p>User agents must act as if any MathML element whose contents does not match the element's
  content model was replaced, for the purposes of MathML layout and rendering, by a <a id=mathml:mathml-merror href=https://w3c.github.io/mathml-core/#error-message-merror data-x-internal=mathml-merror>MathML
  <code>merror</code></a> element containing some appropriate error message.</p>

  

  <p>The semantics of MathML elements are defined by <cite>MathML</cite> and <a id=mathml:other-applicable-specifications href=infrastructure.html#other-applicable-specifications>other applicable
  specifications</a>. <a href=references.html#refsMATHML>[MATHML]</a></p>

  <div class=example>

   <p>Here is an example of the use of MathML in an HTML document:</p>

   <pre><code class='html'><c- cp>&lt;!DOCTYPE html&gt;</c->
<c- p>&lt;</c-><c- f>html</c-> <c- e>lang</c-><c- o>=</c-><c- s>&quot;en&quot;</c-><c- p>&gt;</c->
 <c- p>&lt;</c-><c- f>head</c-><c- p>&gt;</c->
  <c- p>&lt;</c-><c- f>title</c-><c- p>&gt;</c->The quadratic formula<c- p>&lt;/</c-><c- f>title</c-><c- p>&gt;</c->
 <c- p>&lt;/</c-><c- f>head</c-><c- p>&gt;</c->
 <c- p>&lt;</c-><c- f>body</c-><c- p>&gt;</c->
  <c- p>&lt;</c-><c- f>h1</c-><c- p>&gt;</c->The quadratic formula<c- p>&lt;/</c-><c- f>h1</c-><c- p>&gt;</c->
  <c- p>&lt;</c-><c- f>p</c-><c- p>&gt;</c->
   <c- p>&lt;</c-><c- f>math</c-><c- p>&gt;</c->
    <c- p>&lt;</c-><c- f>mi</c-><c- p>&gt;</c->x<c- p>&lt;/</c-><c- f>mi</c-><c- p>&gt;</c->
    <c- p>&lt;</c-><c- f>mo</c-><c- p>&gt;</c->=<c- p>&lt;/</c-><c- f>mo</c-><c- p>&gt;</c->
    <c- p>&lt;</c-><c- f>mfrac</c-><c- p>&gt;</c->
     <c- p>&lt;</c-><c- f>mrow</c-><c- p>&gt;</c->
      <c- p>&lt;</c-><c- f>mo</c-> <c- e>form</c-><c- o>=</c-><c- s>&quot;prefix&quot;</c-><c- p>&gt;</c->−<c- p>&lt;/</c-><c- f>mo</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mi</c-><c- p>&gt;</c->b<c- p>&lt;/</c-><c- f>mi</c-><c- p>&gt;</c->
      <c- p>&lt;</c-><c- f>mo</c-><c- p>&gt;</c->±<c- p>&lt;/</c-><c- f>mo</c-><c- p>&gt;</c->
      <c- p>&lt;</c-><c- f>msqrt</c-><c- p>&gt;</c->
       <c- p>&lt;</c-><c- f>msup</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mi</c-><c- p>&gt;</c->b<c- p>&lt;/</c-><c- f>mi</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mn</c-><c- p>&gt;</c->2<c- p>&lt;/</c-><c- f>mn</c-><c- p>&gt;</c-> <c- p>&lt;/</c-><c- f>msup</c-><c- p>&gt;</c->
       <c- p>&lt;</c-><c- f>mo</c-><c- p>&gt;</c->−<c- p>&lt;/</c-><c- f>mo</c-><c- p>&gt;</c->
       <c- p>&lt;</c-><c- f>mn</c-><c- p>&gt;</c->4<c- p>&lt;/</c-><c- f>mn</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mo</c-><c- p>&gt;</c->⁢<c- p>&lt;/</c-><c- f>mo</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mi</c-><c- p>&gt;</c->a<c- p>&lt;/</c-><c- f>mi</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mo</c-><c- p>&gt;</c->⁢<c- p>&lt;/</c-><c- f>mo</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mi</c-><c- p>&gt;</c->c<c- p>&lt;/</c-><c- f>mi</c-><c- p>&gt;</c->
      <c- p>&lt;/</c-><c- f>msqrt</c-><c- p>&gt;</c->
     <c- p>&lt;/</c-><c- f>mrow</c-><c- p>&gt;</c->
     <c- p>&lt;</c-><c- f>mrow</c-><c- p>&gt;</c->
      <c- p>&lt;</c-><c- f>mn</c-><c- p>&gt;</c->2<c- p>&lt;/</c-><c- f>mn</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mo</c-><c- p>&gt;</c->⁢<c- p>&lt;/</c-><c- f>mo</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mi</c-><c- p>&gt;</c->a<c- p>&lt;/</c-><c- f>mi</c-><c- p>&gt;</c->
     <c- p>&lt;/</c-><c- f>mrow</c-><c- p>&gt;</c->
    <c- p>&lt;/</c-><c- f>mfrac</c-><c- p>&gt;</c->
   <c- p>&lt;/</c-><c- f>math</c-><c- p>&gt;</c->
  <c- p>&lt;/</c-><c- f>p</c-><c- p>&gt;</c->
 <c- p>&lt;/</c-><c- f>body</c-><c- p>&gt;</c->
<c- p>&lt;/</c-><c- f>html</c-><c- p>&gt;</c-></code></pre>

  </div>



  <h4 id=svg-0><span class=secno>4.8.16</span> SVG<a href=#svg-0 class=self-link></a></h4><div class="mdn-anno wrapped"><button onclick=toggleStatus(this) class=mdn-anno-btn><b title="Support in all current engines." class=all-engines-flag>✔</b><span>MDN</span></button><div class=feature><p><a href=https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/HTML5_Parser#Inline_SVG_and_MathML_support title="To build websites, you should know about HTML — the fundamental technology used to define the structure of a webpage. HTML is used to specify whether your web content should be recognized as a paragraph, list, heading, link, image, multimedia player, form, or one of many other available elements or even a new element that you define.">HTML/HTML5/HTML5_Parser#Inline_SVG_and_MathML_support</a><p class=all-engines-text>Support in all current engines.<div class=support><span class="firefox yes"><span>Firefox</span><span>37+</span></span><span class="safari yes"><span>Safari</span><span>11.1+</span></span><span class="chrome yes"><span>Chrome</span><span>7+</span></span><hr><span class="opera yes"><span>Opera</span><span>15+</span></span><span class="edge_blink yes"><span>Edge</span><span>79+</span></span><hr><span class="edge yes"><span>Edge (Legacy)</span><span>12+</span></span><span class="ie yes"><span>Internet Explorer</span><span>10+</span></span><hr><span class="firefox_android yes"><span>Firefox Android</span><span>37+</span></span><span class="safari_ios yes"><span>Safari iOS</span><span>11.3+</span></span><span class="chrome_android yes"><span>Chrome Android</span><span>18+</span></span><span class="webview_android yes"><span>WebView Android</span><span>4.4+</span></span><span class="samsunginternet_android yes"><span>Samsung Internet</span><span>4+</span></span><span class="opera_android yes"><span>Opera Android</span><span>15+</span></span></div></div></div>

  <p>The <a id=svg-0:svg-svg href=https://svgwg.org/svg2-draft/struct.html#SVGElement data-x-internal=svg-svg>SVG <code>svg</code></a> element falls into the <a id=svg-0:embedded-content-category href=dom.html#embedded-content-category>embedded content</a>,
  <a id=svg-0:phrasing-content-2 href=dom.html#phrasing-content-2>phrasing content</a>, <a id=svg-0:flow-content-2 href=dom.html#flow-content-2>flow content</a>, and <a id=svg-0:palpable-content-2 href=dom.html#palpable-content-2>palpable content</a>
  categories for the purposes of the content models in this specification.</p>

  <p>When the <a id=svg-0:svg-foreignobject href=https://svgwg.org/svg2-draft/embedded.html#ForeignObjectElement data-x-internal=svg-foreignobject>SVG <code>foreignObject</code></a> element contains elements from the
  <a id=svg-0:html-namespace-2 href=https://infra.spec.whatwg.org/#html-namespace data-x-internal=html-namespace-2>HTML namespace</a>, such elements must all be <a id=svg-0:flow-content-2-2 href=dom.html#flow-content-2>flow content</a>.</p>

  <p>The content model for the <a id=svg-0:svg-title href=https://svgwg.org/svg2-draft/struct.html#TitleElement data-x-internal=svg-title>SVG <code>title</code></a> element inside <a id=svg-0:html-documents href=https://dom.spec.whatwg.org/#html-document data-x-internal=html-documents>HTML
  documents</a> is <a id=svg-0:phrasing-content-2-2 href=dom.html#phrasing-content-2>phrasing content</a>. (This further constrains the requirements given
  in <cite>SVG 2</cite>.)</p>

  <p>The semantics of SVG elements are defined by <cite>SVG 2</cite> and <a id=svg-0:other-applicable-specifications href=infrastructure.html#other-applicable-specifications>other applicable
  specifications</a>. <a href=references.html#refsSVG>[SVG]</a></p>

  <hr>

  <dl class=domintro><dt><code><var>doc</var> = <var>iframe</var>.<a href=#dom-media-getsvgdocument id=dom-media-getsvgdocument-dev>getSVGDocument</a>()</code><dt><code><var>doc</var> = <var>embed</var>.<a href=#dom-media-getsvgdocument id=svg-0:dom-media-getsvgdocument>getSVGDocument</a>()</code><dt><code><var>doc</var> = <var>object</var>.<a href=#dom-media-getsvgdocument id=svg-0:dom-media-getsvgdocument-2>getSVGDocument</a>()</code><dd><p>Returns the <code id=svg-0:document><a href=dom.html#document>Document</a></code> object, in the case of <code id=svg-0:the-iframe-element><a href=iframe-embed-object.html#the-iframe-element>iframe</a></code>,
   <code id=svg-0:the-embed-element><a href=iframe-embed-object.html#the-embed-element>embed</a></code>, or <code id=svg-0:the-object-element><a href=iframe-embed-object.html#the-object-element>object</a></code> elements being used to embed SVG.</dl>

  

  <p>The <dfn data-dfn-for=HTMLIFrameElement,HTMLEmbedElement,HTMLObjectElement id=dom-media-getsvgdocument data-dfn-type=method><code>getSVGDocument()</code></dfn> method steps are:</p>

  <ol><li><p>Let <var>document</var> be <a id=svg-0:this href=https://webidl.spec.whatwg.org/#this data-x-internal=this>this</a>'s <a id=svg-0:concept-bcc-content-document href=document-sequences.html#concept-bcc-content-document>content document</a>.<li><p>If <var>document</var> is non-null and was created by the <a href=document-lifecycle.html#read-xml id=svg-0:read-xml>page
   load processing model for XML files</a> section because the <a href=https://mimesniff.spec.whatwg.org/#computed-mime-type id=svg-0:content-type-sniffing-2 data-x-internal=content-type-sniffing-2>computed type of the resource</a> in the <a id=svg-0:navigate href=browsing-the-web.html#navigate>navigate</a> algorithm was
   <code id=svg-0:image/svg+xml><a href=indices.html#image/svg+xml>image/svg+xml</a></code>, then return <var>document</var>.<li><p>Return null.</ol>

  



  <h4 id=dimension-attributes><span class=secno>4.8.17</span> <dfn>Dimension attributes</dfn><a href=#dimension-attributes class=self-link></a></h4>

  <p><strong>Author requirements</strong>: The <dfn data-dfn-for=img,iframe,embed,object,source,video id=attr-dim-width data-dfn-type=element-attr><code>width</code></dfn> and
  <dfn data-dfn-for=img,iframe,embed,object,source,video id=attr-dim-height data-dfn-type=element-attr><code>height</code></dfn> attributes on <code id=dimension-attributes:the-img-element><a href=embedded-content.html#the-img-element>img</a></code>, <code id=dimension-attributes:the-iframe-element><a href=iframe-embed-object.html#the-iframe-element>iframe</a></code>,
  <code id=dimension-attributes:the-embed-element><a href=iframe-embed-object.html#the-embed-element>embed</a></code>, <code id=dimension-attributes:the-object-element><a href=iframe-embed-object.html#the-object-element>object</a></code>, <code id=dimension-attributes:the-video-element><a href=media.html#the-video-element>video</a></code>, <code id=dimension-attributes:the-source-element><a href=embedded-content.html#the-source-element>source</a></code> when the parent
  is a <code id=dimension-attributes:the-picture-element><a href=embedded-content.html#the-picture-element>picture</a></code> element and, when their <code id=dimension-attributes:attr-input-type><a href=input.html#attr-input-type>type</a></code>
  attribute is in the <a href="input.html#image-button-state-(type=image)" id="dimension-attributes:image-button-state-(type=image)">Image Button</a> state,
  <code id=dimension-attributes:the-input-element><a href=input.html#the-input-element>input</a></code> elements may be specified to give the dimensions of the visual content of the
  element (the width and height respectively, relative to the nominal direction of the output
  medium), in <a href=https://drafts.csswg.org/css-values/#px id="dimension-attributes:'px'" data-x-internal="'px'">CSS pixels</a>. The attributes, if specified, must have values
  that are <a href=common-microsyntaxes.html#valid-non-negative-integer id=dimension-attributes:valid-non-negative-integer>valid non-negative integers</a>.</p>

  <p>The specified dimensions given may differ from the dimensions specified in the resource itself,
  since the resource may have a resolution that differs from the CSS pixel resolution. (On screens,
  <a href=https://drafts.csswg.org/css-values/#px id="dimension-attributes:'px'-2" data-x-internal="'px'">CSS pixels</a> have a resolution of 96ppi, but in general the CSS pixel
  resolution depends on the reading distance.) If both attributes are specified, then one of the
  following statements must be true:</p>

  <ul><li><var>specified width</var> - 0.5 ≤
             <var>specified height</var> * <var>target ratio</var> ≤
             <var>specified width</var> + 0.5<li><var>specified height</var> - 0.5 ≤
             <var>specified width</var> / <var>target ratio</var> ≤
             <var>specified height</var> + 0.5<li><var>specified height</var> = <var>specified width</var> = 0</ul>

  <p>The <var>target ratio</var> is the ratio of the <a id=dimension-attributes:natural-width href=https://drafts.csswg.org/css-images/#natural-width data-x-internal=natural-width>natural width</a> to the
  <a id=dimension-attributes:natural-height href=https://drafts.csswg.org/css-images/#natural-height data-x-internal=natural-height>natural height</a> in the resource. The <var>specified width</var> and <var>specified
  height</var> are the values of the <code id=dimension-attributes:attr-dim-width><a href=#attr-dim-width>width</a></code> and <code id=dimension-attributes:attr-dim-height><a href=#attr-dim-height>height</a></code> attributes respectively.</p>

  <p>The two attributes must be omitted if the resource in question does not have both a
  <a id=dimension-attributes:natural-width-2 href=https://drafts.csswg.org/css-images/#natural-width data-x-internal=natural-width>natural width</a> and a <a id=dimension-attributes:natural-height-2 href=https://drafts.csswg.org/css-images/#natural-height data-x-internal=natural-height>natural height</a>.</p>

  <p>If the two attributes are both 0, it indicates that the element is not intended for the user
  (e.g. it might be a part of a service to count page views).</p>

  <p class=note>The dimension attributes are not intended to be used to stretch the image.</p>

  

  <p><strong>User agent requirements</strong>: User agents are expected to use these attributes <a href=rendering.html#dimRendering>as hints for the rendering</a>.</p>

  <p class=note>For <code id=dimension-attributes:the-iframe-element-2><a href=iframe-embed-object.html#the-iframe-element>iframe</a></code>, <code id=dimension-attributes:the-embed-element-2><a href=iframe-embed-object.html#the-embed-element>embed</a></code> and <code id=dimension-attributes:the-object-element-2><a href=iframe-embed-object.html#the-object-element>object</a></code> the IDL
  attributes are <code id=dimension-attributes:idl-domstring><a data-x-internal=idl-domstring href=https://webidl.spec.whatwg.org/#idl-DOMString>DOMString</a></code>; for <code id=dimension-attributes:the-video-element-2><a href=media.html#the-video-element>video</a></code> and
  <code id=dimension-attributes:the-source-element-2><a href=embedded-content.html#the-source-element>source</a></code> the IDL attributes are <code id=dimension-attributes:idl-unsigned-long><a data-x-internal=idl-unsigned-long href=https://webidl.spec.whatwg.org/#idl-unsigned-long>unsigned
  long</a></code>.</p>

  <p class=note>The corresponding IDL attributes for <code id=dimension-attributes:dom-img-height><a href=embedded-content.html#dom-img-height>img</a></code> and
  <code id=dimension-attributes:dom-input-height><a href=input.html#dom-input-height>input</a></code> elements are defined in those respective elements'
  sections, as they are slightly more specific to those elements' other behaviors.</p>

  



  <nav><a href=image-maps.html>← 4.8.12 The map element</a> — <a href=index.html>Table of Contents</a> — <a href=tables.html>4.9 Tabular data →</a></nav>
